﻿<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage_HomePage.master" AutoEventWireup="true" CodeFile="BookTicket_2.aspx.cs" Inherits="Clients_BookTicket_2" %>

 <asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
<script>
    var dem = 1;
    function generatenew() {
        dem = dem + 1;
        var d = document.getElementById("thongtinnguoidatcho");
        var value = document.getElementById('<%=txtseatused.ClientID%>').value;
        var iner = "<div id=chua" + dem + "></br><p>" + dem + ". FullName:</p> <input id='txtname" + dem + "' type='text'> <p> Choose seat:</p><select id='txtseat" + dem + "'> </select> <p> Age:</p> <select id='txtage" + dem + "'/>"
        d.innerHTML += iner;
        addselect(dem);
        addage(dem);
        removeitem(value, dem);
        
    }

    function addselect(dem) { 
   
    var myobject = {
        A1: 'A1',A2: 'A2',A3: 'A3',A4: 'A4',
        B1: 'B1',B2: 'B2',B3: 'B3',B4: 'B4',
        C1: 'C1',C2: 'C2',C3: 'C3',C4: 'C4',
        D1: 'D1',D2: 'D2',D3: 'D3',D4: 'D4',
        E1: 'E1',E2: 'E2',E3: 'E3',E4: 'E4',
        F1: 'F1',F2: 'F2',F3: 'F3',F4: 'F4',
        G1: 'G1',G2: 'G2',G3: 'G3',G4: 'G4',
        H1: 'H1',H2: 'H2',H3: 'H3',H4: 'H4',
        I1: 'I1',I2: 'I2',I3: 'I3',I4: 'I4',
        J1: 'J1',J2: 'J2',J3: 'J3',J4: 'J4',
        K1: 'K1',K2: 'K2',K3: 'K3',K4: 'K4',
        L1: 'L1',L2: 'L2',L3: 'L3',L4: 'L4',L5: 'L5'
	};

    var select = document.getElementById("txtseat" + dem);
	for(index in myobject) {
	    select.options[select.options.length] = new Option(myobject[index], index);
	}

}

function addage(dem) {

    var myobject = {
        1: '1', 2: '2', 3: '3', 4: '4'
    };

    var select = document.getElementById("txtage" + dem);
    for (index in myobject) {
        select.options[select.options.length] = new Option(myobject[index], index);
    }

}

function getallvalue() {
    var i = 1;
    var chua = "";
    while(i<=dem) {
        var getname = document.getElementById('txtname' + i).value;
        var getseat = document.getElementById('txtseat' + i).value;
        var getage = document.getElementById('txtage' + i).value;
        chua = chua + getname + "," + getseat + "," + getage+";";
        document.getElementById('<%=txtallelement.ClientID%>').value = chua;

        alert(escape(getname));
        i++;
    }
}


function removeitem(items,combobox) {
    var sel = $("select#txtseat"+combobox);
    var a = items.split(",") // Delimiter is a string
    for (var i = 0; i < a.length; i++) {
       4
        sel.find("option[value='"+a[i]+"']").remove();
    }

}


function removeElement() {

    if (dem > 1) {
        var child = document.getElementById('chua' + dem);
        var parent = document.getElementById('thongtinnguoidatcho');
        parent.removeChild(child);
        dem = dem - 1;
    }
}

function alerterror(x) { 
//    var show = alert(x)
    //    return show;
    alert(x);
}
</script>


</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
		<form id="form1" runat="server">
		<div id="title">
             <p class="title">Detail Bus</p>
            <asp:HiddenField ID="txtseatused" runat="server" />                    
            <asp:HiddenField ID="txtallelement" runat="server" />
            <div id="hinhghexe">
            <img src="../Images/Ghe.png" alt="" />
            </div>
            <div id="thongtinnguoidatcho">
                <div id=chua1>
                <p>1. FullName:</p> <input id="txtname1" type="text">
            	    <p>Choose seat:</p><select id="txtseat1"></select>
                    <p>Age:</p> <select id='txtage1'></select>
				    <input type="button"  value="Book more" onclick="generatenew()">
                     <input type="button"  value="Remove Item" onclick="removeElement()">
                </div>
				
            </div>     
             <table width="960px">
            	<tr>
                	<td align="right" width="150px" style="font-weight:bold">Full Name*</td>
                    <td><input name="" type="text"></td>                                     
                </tr>
                <tr>
                	<td align="right"  style="font-weight:bold">Moblie Number*</td>
                    <td><input name="" type="text"></td>
                </tr>
                <tr>
                	<td align="right" style="font-weight:bold">All Phone No*</td>
                    <td><input name="" type="text"></td>
                </tr>
                <tr>
                	<td align="right"  style="font-weight:bold">Email Id*</td>
                    <td><input name="" type="text"></td>
                </tr>
                <tr>
                	<td align="right" style="font-weight:bold">Email Id*</td>
                    <td><textarea name="" cols="" rows="" ></textarea></td>
                </tr>
            </table>      
        
             

            <asp:Button ID="btncontinute" runat="server" Text="Continute" 
                 OnClientClick="getallvalue()" CssClass="button" 
                 onclick="btncontinute_Click"/>
         
             </br>                                                           
        </div><!--End tag div title return getallvalue();-->    
            </form>
                    
</asp:Content>

